<template>
	<div class="search">
		<router-link to="/layout/jingqu">
			<i class="iconfont icon-sousuo sousuo"></i>
			<input type="text" placeholder="搜索">
			<div id="close" >
				<img src="../assets/smallIcon/guanbi.png" alt="">
			</div>
		</router-link>
	</div>
</template>
<script>
	export default {
		name:"search",
		data (){
			return {

			}
		}
	}
</script>

<style scoped lang="less">
	.search{
		float: left;
		position: relative;
		margin-left: 34 /50rem;
		overflow: hidden;
		z-index: 666;
		input{
			width: 456 /50rem;
			height: 66 /50rem;
			border-radius: 33 /50rem;
			border: none;
			background-color: rgba(255,255,255,0.4);
			outline: none;
			float: left;
			margin-top: 10 /50rem;
			text-indent: 80 /50rem;
			color:#fff;
		}
		::-webkit-input-placeholder{
			color:#fff;
		}
		.sousuo{
			float: left;
			position: absolute;
			left: 32 /50rem;
			top:32 /50rem;
			color:#fff;
		}
		#close{
			position: absolute;
			right: 20 /50rem;
			top:38%;
			img{
				width: 30 /50rem;
				height: 30 /50rem;
			}
		}
	}
</style>